<template>
	<view class="container" :class="skinStyle">
		<scroll-view scroll-y style="width: 100%; height: 100vh;">
			<view class="tui-refund-goods" style="border-bottom: 1px solid #F2F2F2; border-radius: 0rpx;">
				<view>{{ refundProduct }}</view>
			</view>
			<view class="tui-cart-cell" v-for="(item, index) in shopcartList" :key="index">
				<view class="tui-goods-item-wrap" v-if="item.show !== 2">
					<checkbox-group @change="selectSingle(item)" class="tui-checkbox"><checkbox :checked="item.checked" :disabled="item.disabled" color="#fff" /></checkbox-group>
					<view class="tui-goods-item" style="position: relative;">
						<image src="../../../static/img/gift.png" class="imgMark" v-if="item.isSample === 1 || item.isSample === 2 || item.isSample === 3"></image>
						<image :src="imgSrc + item.suitProductThumbnailImageUrl" v-if="item.isSuit" class="tui-goods-img"></image>
						<image :src="imgSrc + item.productThumbnailImageUrl" v-else class="tui-goods-img" />
						<view class="tui-goods-info">
							<view class="tui-goods-title" v-if="item.isSuit">{{ item.suitName }}</view>
							<view class="tui-goods-title" v-else>{{ item.productName }}</view>
							<view class="tui-goods-model">
								<view class="tui-model-text" v-if="item.isSuit"></view>
								<view class="tui-model-text" v-else>{{ item.specificationName }}</view>
							</view>
							<view class="tui-price-box">
								<view class="tui-goods-price" v-if="item.isSuit">￥{{ item.suitRealPrice | moneyFormat(item.suitRealPrice) }}</view>
								<view class="tui-goods-price" v-else>￥{{ item.productRealPrice | moneyFormat(item.productRealPrice) }}</view>
								<view class="tui-scale">
									<tui-numberbox
										:value="item.productsCount"
										:height="38"
										:width="70"
										:min="1"
										:disabled="item.disabled"
										:max="item.remain"
										:index="index"
										@change="changeNum($event, index)"
									></tui-numberbox>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="">
				<picker @change="typeChange" :value="typeIndex" :range="typeArray" :disabled="true">
					<view class="refundInfo">
						<view class="setupTitle">{{ refundType }}</view>
						<view class="setupCon">
							<text class="" v-if="typeLabel">{{ typeLabel }}</text>
							<text class="" v-else>请选择</text>
						</view>
					</view>
				</picker>
			</view>
			<view class="">
				<picker @change="reasonChange" :value="reasonIndex" :range="reasonArray">
					<view class="refundInfo">
						<view class="setupTitle">{{ refundReason }}</view>
						<view class="setupCon">
							<text class="" v-if="reasonLabel">{{ reasonLabel }}</text>
							<text class="" v-else>请选择</text>
							<text class="iconfont iconxiangyou"></text>
						</view>
					</view>
				</picker>
			</view>
			<view class="" v-if="typeIndex != 3">
				<view class="refundInfo">
					<view class="setupTitle">退款金额</view>
					<view class="setupCon">
						<text class="refundMoney">￥{{ refundMoney | moneyFormat(refundMoney) }}</text>
					</view>
				</view>
			</view>
			<view class="tui-order-content" style="margin-top: 10rpx;">
				<view class="tui-skeleton-fillet">
					<view class="tui-order-flex"><view style="font-size: 32rpx;">退款说明:</view></view>
					<view class="tui-order-flex" style="display: block;line-height: 40rpx;">
						<view class="returnContent" style="color: #fc5a58;">1、退款后订单金额小于{{ carriageLimit }}元，退款时会扣除{{ carriagePrice }}元运费，敬请谅解。</view>
						<view class="returnContent" style="color: #fc5a58;" v-if="typeIndex != 2">2、请按照退货地址准确填写退货单。</view>
						<view class="returnContent" style="color: #fc5a58;" v-if="typeIndex != 2 && (reasonIndex == 1 || reasonIndex == 4)">
							3、售后申请提交之前，请务必联系客服。
						</view>
						<view class="returnContent" style="color: #fc5a58;" v-else-if="typeIndex != 2">3、退货邮费到付拒不签收。</view>
					</view>
				</view>
			</view>
			<view class="">
				<view class="refundInfo">
					<view class="setupTitle">退款说明</view>
					<view class="setupCon"><text class="refundMark">退款理由建议100字以内</text></view>
				</view>
				<view class="refundInfo" style="margin-top: 0rpx;">
					<view class="text-view"><textarea v-model="refundMark" class="text-area" /></view>
				</view>
			</view>
			<!-- 		<view class="" v-if="typeIndex != 2">
			<picker @change="companyChange" :value="companyIndex" :range="companyArray">
				<view class="refundInfo">
					<view class="setupTitle">物流公司</view>
					<view class="setupCon">
						<text class="" v-if="companyLabel">{{ companyLabel }}</text>
						<text class="" v-else>请选择</text>
						<text class="iconfont iconxiangyou"></text>
					</view>
				</view>
			</picker>
		</view>
		<view class="" v-if="typeIndex != 2">
			<view class="refundInfo">
				<view class="setupTitle">物流单号</view>
				<view class="setupCon"><input type="text" class="tui-remark" v-model="logisticsCode" /></view>
			</view>
		</view> -->
			<view class="">
				<view class="refundInfo" style="padding-bottom: 0px;">
					<view class="setupTitle">上传凭证</view>
					<view class="setupCon"><text class="refundMark">最多3张图片</text></view>
				</view>
				<view class="refundInfo" style="margin-top: 0rpx;">
					<tui-upload class="upload-wrap" :limit="limit" :value="imgArr" @complete="getImgResult($event, 'img3')" @remove="removeImg($event, 'img3')"></tui-upload>
				</view>
			</view>
			<view class="tui-safe-area"></view>
			<view class="bot-btn-wrap fix-bot" :class="[isIOS == 1 ? 'iosPB' : 'AndroidPB']" style="z-index: 999;">
				<mix-button :disabled="uploadImg" text="提交申请" icon="icon-jia2" :iconSize="36" :isConfirm="false" @onConfirm="submit()"></mix-button>
			</view>
		</scroll-view>
		<loading></loading>
		<tui-modal></tui-modal>
	</view>
</template>
<script>
import baseComponent from '@/components/baseComponent/baseComponent';
import footBar from '@/components/footbar/footbar';
import mixin from '@/utils/mixin.js';
import tuiSwipeAction from '@/components/swipe-action/swipe-action';
import tuiButton from '@/components/button/button';
import tuiNumberbox from '@/components/numberbox/numberbox';
import tuiDivider from '@/components/divider/divider';
import tuiLoadmore from '@/components/loadmore/loadmore';
import mixButton from '@/components/mix-button/mix-button.vue';
import mixEmpty from '@/components/mix-empty/mix-empty.vue';
import tuiUpload from '@/components/tui-upload/tui-upload';
export default {
	mixins: [mixin],
	components: {
		baseComponent,
		footBar,
		tuiSwipeAction,
		tuiButton,
		tuiNumberbox,
		tuiDivider,
		tuiLoadmore,
		mixEmpty,
		mixButton,
		tuiUpload
	},

	data() {
		return {
			limit: 3,
			typeFlag: '',
			imgSrc: this.$store.state.imgUrl,
			selectedIndex: 2,
			shopcartList: [],
			pageId: '',
			nodataFlg: false,
			number: 0,
			isEdit: false,
			productCount: 0,
			upOption: {
				noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
				textNoMore: '-- 无更多信息 --'
			},
			allChecked: false,
			totalPrice: 0.0,
			invalid: [],
			refundType: '售后类型',
			refundReason: '售后原因',
			refundProduct: '退款商品',
			typeIndex: '',
			typeArray: ['', '我要退货退款', '我要退款(无需退货)', '我要换货'],
			typeLabel: '',
			reasonIndex: '',
			reasonArray: ['7天无理由退款', '商品有质量问题', '商品少发漏发发错', '商品与描述不一致', '收到商品时有划痕或破损', '质疑假货', '其他'],
			reasonLabel: '',
			refundMoney: 0,
			refundMark: '',
			item: '',
			logisticsCode: '',
			companyIndex: '',
			companyArray: [
				'圆通速递',
				'韵达快递',
				'中通快递',
				'顺丰速运',
				'申通快递',
				'邮政快递包裹',
				'百世快递',
				'京东物流',
				'EMS',
				'极兔速递',
				'邮政标准快递',
				'德邦',
				'德邦快递',
				'宅急送',
				'圆通快运',
				'百世快运',
				'优速快递',
				'中通国际',
				'众邮快递',
				'中通快运',
				'安能快运',
				'韵达快运',
				'国际包裹',
				'安得物流',
				'UPS-全球件',
				'顺丰快运',
				'D速快递',
				'UPS',
				'FedEx-国际件',
				'DHL-全球件',
				'DHL-中国件',
				'美快国际物流',
				'天天快递',
				'USPS',
				'特急送',
				'YUNTRACK',
				'苏宁物流',
				'TNT',
				'芝麻开门',
				'递四方',
				'EMS-国际件',
				'速尔快递',
				'跨越速运',
				'丹鸟',
				'EWE全球快递',
				'壹米滴答',
				'申通国际',
				'加运美',
				'威盛快递'
			],
			companyLabel: '',
			listFlag: '',
			editFlag: '',
			rejectEvidencePath1: '',
			rejectEvidencePath2: '',
			rejectEvidencePath3: '',
			imgArr: [],
			uploadImg: false,
			carriagePrice: 0,
			carriageLimit: 0,
			orderId: '',
			rejectNo: '',
			maxRejectNo: 0,
			maxAmount: 0,
			isIOS: 1
		};
	},
	computed: {},
	created() {
		this.imgArr = uni.getStorageSync('imgArr');
	},
	onLoad(options) {
		// #ifdef H5
		this.$wechat.noShare();
		// #endif
		this.listFlag = options.listFlag;
		if (options.item) {
			this.item = uni.getStorageSync('returnOrder');
			uni.removeStorageSync('returnOrder');
			this.shopcartList = this.item.productInfo;
			this.typeIndex = options.type;
			this.typeLabel = this.typeArray[this.typeIndex];
			if (options.listFlag == 1) {
				for (let i = 0; i < this.reasonArray.length; i += 1) {
					if (this.reasonArray[i] == this.item.refundReason) {
						this.reasonIndex = i;
						this.reasonLabel = this.reasonArray[i];
					}
				}
				this.refundMark = this.item.refundText;
			}
			this.maxRejectNo = this.item.productInfo[0].maxRejectNo;
			this.maxAmount = this.moneyFormat(this.item.realAmount - this.item.logisticsCost);
			this.shopcartList.forEach((item, index) => {
				item.productsCount = JSON.parse(JSON.stringify(item.remain));
			});
			this.getTotalPrice();
		} else {
			this.orderId = options.orderId;
			this.rejectNo = options.rejectNo;
			this.getReturnOrderDetail();
		}
	},
	onShow() {
		this.carriageSettingFun();
		if (uni.getSystemInfoSync().platform != 'ios') {
			this.isIOS = 2;
		}
	},
	filters: {
		moneyFormat(num) {
			var result = parseFloat(num);
			result = Math.round(num * 100) / 100;
			var s_x = result.toString();
			var pos_decimal = s_x.indexOf('.');
			if (pos_decimal < 0) {
				pos_decimal = s_x.length;
				s_x += '.';
			}
			while (s_x.length <= pos_decimal + 2) {
				s_x += '0';
			}
			return s_x;
		}
	},
	methods: {
		moneyFormat(num) {
			var result = parseFloat(num);
			result = Math.round(num * 100) / 100;
			return result;
		},
		getReturnOrderDetail() {
			const params = {
				orderId: this.orderId,
				rejectNo: this.rejectNo
			};
			this.$http.getReturnOrderDetail(params).then(res => {
				if (res.status === 0) {
					//获取各种信息
					this.shopcartList = [];
					res.data.records.forEach((item3, index3) => {
						if (item3.rejectStatus === 0 || item3.rejectStatus === 3) {
							this.shopcartList.push(item3);
						}
					});
					for (let i = 0; i < this.reasonArray.length; i += 1) {
						if (this.reasonArray[i] == this.shopcartList[0].refundReason) {
							this.reasonIndex = i;
							this.reasonLabel = this.reasonArray[i];
						}
					}
					this.typeIndex = parseInt(this.shopcartList[0].rejectType);
					this.typeLabel = this.typeArray[this.typeIndex];
					this.refundMark = this.shopcartList[0].refundText;
					this.rejectEvidencePath1 = this.shopcartList[0].rejectEvidencePath1;
					this.rejectEvidencePath2 = this.shopcartList[0].rejectEvidencePath2;
					this.rejectEvidencePath3 = this.shopcartList[0].rejectEvidencePath3;
					this.rejectExpressCompany = this.shopcartList[0].rejectExpressCompany;
					this.rejectExpressOrderNum = this.shopcartList[0].rejectExpressOrderNum;
					this.maxRejectNo = res.data.rejectNo;
					// //加入赠品
					// let giftList = this.shopcartList[0].giftList;
					// giftList.forEach((item2, index2) => {
					// 	item2.productRealPrice = 0.0;
					// 	item2.isSample = 1;
					// });
					let suitIdArr = [];
					let index = [];
					//添加信息
					this.shopcartList.forEach((item, index2) => {
						if (item.suitId) {
							let id = item.suitId + item.isSample;
							if (!suitIdArr.includes(id)) {
								item.isSuit = true;
								suitIdArr.push(id);
								item.suitRealPrice = 0;
								item.suitRealPrice += this.moneyFormat(item.rejectAmount / item.suitCount);
								index.push({
									num: index2,
									id: id
								});
							} else if (suitIdArr.includes(id)) {
								item.show = 2;
								for (let i = 0; i < index.length; i += 1) {
									if (index[i].id === id) {
										let n = index[i].num;
										this.shopcartList[n].suitRealPrice += this.moneyFormat(item.rejectAmount / item.suitCount);
									}
								}
							}
						}
						if (item.isSuit || item.show === 2) {
							item.remain = JSON.parse(JSON.stringify(item.suitCount));
							item.productsCount = JSON.parse(JSON.stringify(item.suitCount));
						} else {
							item.remain = JSON.parse(JSON.stringify(item.productsCount));
						}

						var num1 = this.moneyFormat(item.rejectAmount / item.productsCount);
						item.productRealPrice = num1;
						item.checked = true;
						item.disabled = true;
					});
					this.getTotalPrice(2);
				}
			});
		},
		carriageSettingFun() {
			this.$http.carriageSetting().then(res => {
				if (res.status === 0) {
					this.carriagePrice = res.data.carriagePrice;
					this.carriageLimit = res.data.carriageLimit;
				}
			});
		},
		getImgResult: function(e, type) {
			console.log(e);
			if (e.status == 2) {
				this.uploadImg = true;
			} else if (e.status == 1) {
				this.uploadImg = false;
			}
			if (e.imgArr.length === 1) {
				this.rejectEvidencePath1 = e.imgArr[0];
			} else if (e.imgArr.length === 2) {
				this.rejectEvidencePath1 = e.imgArr[0];
				this.rejectEvidencePath2 = e.imgArr[1];
			} else if (e.imgArr.length === 3) {
				this.rejectEvidencePath1 = e.imgArr[0];
				this.rejectEvidencePath2 = e.imgArr[1];
				this.rejectEvidencePath3 = e.imgArr[2];
			}
		},
		removeImg: function(e) {
			//移除图片
			console.log(e);
			if (e.index === 0) {
				this.rejectEvidencePath1 = '';
				this.rejectEvidencePath2 = '';
				this.rejectEvidencePath3 = '';
			} else if (e.index === 1) {
				this.rejectEvidencePath2 = '';
				this.rejectEvidencePath3 = '';
			} else if (e.index === 2) {
				this.rejectEvidencePath3 = '';
			}
		},
		// 选择退款类型
		typeChange(e) {
			// this.typeIndex = e.target.value;
			// this.typeLabel = this.typeArray[this.typeIndex];
			// if (this.typeIndex == 3) {
			// 	this.refundType = '换货类型';
			// 	this.refundReason = '换货原因';
			// } else {
			// 	this.refundType = '退款类型';
			// 	this.refundReason = '退款原因';
			// }
		},
		changeNum(e, index) {
			console.log(e);
			this.shopcartList[index].productsCount = e.value;
			this.shopcartList.forEach((item, index2) => {
				if (this.shopcartList[index].suitId && this.shopcartList[index].suitId == item.suitId) {
					item.productsCount = e.value;
				}
			});
			this.getTotalPrice();
		},
		selectSingle(item2) {
			if (!item2.suitId) {
				item2.checked = !item2.checked;
			}

			let num = 0;
			this.shopcartList.forEach((item, index) => {
				if (item.checked) {
					num++;
				}
				if (item2.suitId && item.suitId === item2.suitId) {
					item.checked = !item.checked;
				}
			});
			this.getTotalPrice();
			if (num === 0) {
				uni.showToast({
					icon: 'none',
					title: '请至少选择一件商品'
				});
			}
		},
		getTotalPrice(id) {
			let price = 0;
			if (id === 2) {
				this.shopcartList.forEach((item, index) => {
					price += item.rejectAmount;
				});
			} else {
				this.shopcartList.forEach((item, index) => {
					if (item.checked) {
						// if (item.isSuit) {
						// 	if (item.productsCount === item.remain) {
						// 		price += parseFloat(this.moneyFormat(item.suitRealAmount - item.suitRejectAmount));
						// 	} else {
						// 		// price += item.productsCount * item.suitRealPrice;
						// 		price +=  item.suitRealAmount*item.productsCount/item.suitCount
						// 	}
						// } else if (item.show !== 2) {
						if (!item.once) {
							item.once = 1;
						}
						if (item.productsCount === item.remain * item.once) {
							price += parseFloat(this.moneyFormat(item.realAmount - item.detailRejectAmount));
						} else {
							// price += item.productsCount * item.productRealPrice;
							price += this.moneyFormat((item.realAmount * item.productsCount * item.once) / item.singleCount);
						}
						// }
						if (this.maxAmount < price) {
							price = this.maxAmount;
						}
					}
				});
			}
			this.refundMoney = price;
		},

		// 选择退款原因
		reasonChange(e) {
			this.reasonIndex = e.target.value;
			this.reasonLabel = this.reasonArray[this.reasonIndex];
		},
		companyChange(e) {
			this.companyIndex = e.target.value;
			this.companyLabel = this.companyArray[this.companyIndex];
		},
		// 提交申请
		submit() {
			if ((this.reasonIndex == 1 || this.reasonIndex == 4) && (this.rejectEvidencePath1 === '' || this.rejectEvidencePath1 == null)) {
				this.$util.msg('有质量问题或有破损时必须传图片，并联系客服');
				return;
			}

			if (this.reasonIndex === '') {
				this.$util.msg('请选择' + this.refundReason);
				return;
			}
			if (this.typeIndex === '') {
				this.$util.msg('请选择' + this.refundType);
				return;
			}
			let num = 0;
			this.shopcartList.forEach((item, index) => {
				if (item.checked) {
					num++;
				}
			});
			if (num === 0) {
				uni.showToast({
					icon: 'none',
					title: '请至少选择一件商品'
				});
				return;
			}
			this.uploadImg = true;
			let list = [];
			let rejectType = '';
			rejectType = this.typeIndex;
			let rejectIdList = [];
			for (let i = 0; i < this.shopcartList.length; i += 1) {
				let rejectId = '';
				if (this.listFlag == 1) {
					rejectId = this.shopcartList[i].rejectId;
					rejectIdList.push(this.shopcartList[i].rejectId);
				}

				if (this.shopcartList[i].checked) {
					let type = 1;
					let status = 0;
					// let price = this.shopcartList[i].productsCount * this.shopcartList[i].productRealPrice;
					let price;
					if (this.item) {
						price = this.moneyFormat(
							(this.shopcartList[i].realAmount * this.shopcartList[i].productsCount * this.shopcartList[i].once) / this.shopcartList[i].singleCount
						);
						if (this.shopcartList[i].productsCount === this.shopcartList[i].remain) {
							price = parseFloat(this.moneyFormat(this.shopcartList[i].realAmount - this.shopcartList[i].detailRejectAmount));
						}
						if (price > this.maxAmount) {
							price = this.maxAmount;
						}
					}
					if (this.typeIndex == 1) {
						type = 2;
					} else if (this.typeIndex == 3) {
						type = 14;
						status = 3;
					}

					let productsCount;
					if (this.item) {
						if (this.shopcartList[i].isSuit || this.shopcartList[i].show == 2) {
							productsCount = this.shopcartList[i].once * this.shopcartList[i].productsCount;
						} else {
							productsCount = this.shopcartList[i].productsCount;
						}
					}
					const rejectInfo = {
						orderId: this.item.orderId,
						productThumbnailImageUrl: this.shopcartList[i].productThumbnailImageUrl,
						productName: this.shopcartList[i].productName,
						productPrice: this.shopcartList[i].productPrice,
						productId: this.shopcartList[i].productId,
						orderProductId: this.shopcartList[i].orderProductId,
						specificationId: this.shopcartList[i].specificationId,
						specificationName: this.shopcartList[i].specificationName,
						productsCount: productsCount,
						customerServiceStatus: type,
						refundReason: this.reasonArray[this.reasonIndex],
						refundText: this.refundMark,
						rejectAmount: price,
						rejectStatus: status,
						rejectType: rejectType,
						rejectId: rejectId,
						rejectEvidencePath1: this.rejectEvidencePath1,
						rejectEvidencePath2: this.rejectEvidencePath2,
						rejectEvidencePath3: this.rejectEvidencePath3,
						rejectNo: this.maxRejectNo,
						isSample: this.shopcartList[i].isSample,
						suitId: this.shopcartList[i].suitId
					};
					list.push(rejectInfo);
				}
			}
			if (this.listFlag == 0) {
				const params = {
					rejectEditInfo: list
				};
				var that = this;
				this.$http.createReject(params).then(res => {
					this.uploadImg = false;
					if (res.status == 0) {
						uni.showToast({
							icon: 'none',
							title: '申请成功'
						});
						that.$eventHub.$emit('orderRefresh');
						if (rejectType != '2') {
							const rejectId = JSON.stringify(res.data.rejectId);
							uni.redirectTo({
								url: './logisticsCode?id=' + rejectId
							});
						} else {
							uni.redirectTo({
								url: '../myOrder/returnOrderList'
							});
						}
					}
				});
			} else if (this.listFlag == 1) {
				const params = {
					rejectEditInfo: list
				};
				var that = this;
				this.$http.editReject(params).then(res => {
					this.uploadImg = false;
					if (res.status == 0) {
						uni.showToast({
							icon: 'none',
							title: '修改成功'
						});
						if (rejectType != '2') {
							const item = JSON.stringify(rejectIdList);
							uni.redirectTo({
								url:
									'./logisticsCode?id=' +
									item +
									'&isEdit=1&rejectExpressOrderNum=' +
									this.rejectExpressOrderNum +
									'&rejectExpressCompany=' +
									this.rejectExpressCompany
							});
						} else {
							that.$eventHub.$emit('refundRefresh');
							uni.navigateBack({});
						}
					}
				});
			}
		}
	}
};
</script>

<style lang="scss">
.bot-btn-wrap {
	bottom: 0rpx !important;
}
.iosPB {
	padding-bottom: env(safe-area-inset-bottom) !important;
}
.AndroidPB {
	padding-bottom: 20rpx !important;
}
::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
	color: transparent;
}
.imgMark {
	position: absolute;
	width: 100rpx !important;
	height: 100rpx !important;
	top: 0px;
	left: 12rpx;
	z-index: 100;
}
.refundInfo .idCard-upload-inner {
	width: 100rpx;
	height: 100rpx;
	line-height: 100rpx;
}
.refundMark {
	color: #999;
	font-size: 24rpx;
}
.text-view {
	width: 100%;
	margin: 0 auto;
	margin-top: -20px;
}
.text-area {
	width: 100%;
	border: 1px solid #e6e6e6;
	margin-top: 10px;
}
.text-area::hover {
	border-color: #3bb4f2;
}
.refundMoney {
	color: #fc5a58;
}
.returnContent {
	color: #666666;
	font-size: 26rpx;
}
.container {
	overflow: hidden;
}
/deep/ .uni-scroll-view::-webkit-scrollbar {
	/* 隐藏滚动条，但依旧具备可以滚动的功能 */
	display: none;
}
.nodata-wrap {
	width: 100%;
	height: 100%;
	background: #fff;
	.img {
		width: 300rpx;
		height: 300rpx;
		margin: 15% auto 50rpx auto;
		display: block;
		img {
			width: 100%;
			opacity: 0.5;
		}
	}
	.text {
		display: block;
		text-align: center;
		color: #ccc;
	}
}
// /deep/ uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked:before{
// 	color:#fff;
// }
// /deep/ uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked:before{
// 	font-size: 32rpx;
// 	color:$themeColor;
// }
// /deep/ uni-checkbox.gray-checkbox .uni-checkbox-input{
// 	background:$borderColor;
// }
.tui-mtop {
	margin-top: 10rpx;
}

.tui-refund-goods {
	width: 100%;
	border-radius: 12rpx;
	overflow: hidden;
	padding: 20rpx 30rpx 10rpx 30rpx;
	box-sizing: border-box;
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: #333;
	font-size: 30rpx;
	background-color: #ffffff;
}

.tui-goods-num {
	font-weight: bold;
	//color: $themeColor;
}

.tui-cart-cell {
	width: 100%;
	background: #ffffff;
	overflow: hidden;
}
.swipe-action {
	.tui-swipeout-item {
		padding: 30rpx 0;
	}
}
.tui-goods-item-wrap {
	padding: 0 30rpx;
	display: flex;
	margin: 20rpx 0;

	.tui-checkbox {
		width: 55rpx;
		display: flex;
		align-items: center;
		float: left;
		margin-right: 10rpx;
	}
	.tui-goods-item {
		flex: 1;
		// width:calc(100%-110rpx);
		display: flex;
		box-sizing: border-box;
	}
}

.tui-goods-img {
	width: 220rpx;
	height: 220rpx !important;
	border-radius: 12rpx;
	flex-shrink: 0;
	display: block;
}

.tui-goods-info {
	flex: 1;
	width: 100%;
	padding-left: 20rpx;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	box-sizing: border-box;
	overflow: hidden;
}

.tui-goods-title {
	white-space: normal;
	word-break: break-all;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	font-size: 26rpx;
	color: #333;
}

.tui-goods-model {
	max-width: 100%;
	color: #333;
	background: #f5f5f5;
	border-radius: 40rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 16rpx;
	box-sizing: border-box;
}

.tui-model-text {
	max-width: 100%;
	transform: scale(0.9);
	transform-origin: 0 center;
	font-size: 26rpx;
	line-height: 32rpx;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.tui-price-box {
	width: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

.tui-goods-price {
	font-size: 34rpx;
	font-weight: 500;
	color: $red;
}

.tui-scale {
	transform-origin: 100% 100%;
}

.tui-activity {
	font-size: 28rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 30rpx 20rpx 30rpx;
	box-sizing: border-box;
	height: 110rpx;
}

.tui-buy {
	display: flex;
	align-items: center;
}

.tui-bold {
	font-weight: bold;
}

/*猜你喜欢*/
.tui-youlike {
	padding-left: 12rpx;
}

.tui-product-list {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: wrap;
	box-sizing: border-box;
}

.tui-product-container {
	flex: 1;
	margin-right: 2%;
}

.tui-product-container:last-child {
	margin-right: 0;
}

.tui-pro-item {
	width: 100%;
	margin-bottom: 4%;
	background: #fff;
	box-sizing: border-box;
	border-radius: 12rpx;
	overflow: hidden;
}

.tui-pro-img {
	width: 100%;
	display: block;
}

.tui-pro-content {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;
	padding: 20rpx;
}

.tui-pro-tit {
	color: #2e2e2e;
	font-size: 26rpx;
	word-break: break-all;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.tui-pro-price {
	padding-top: 18rpx;
}

.tui-factory-price {
	font-size: 24rpx;
	color: #a0a0a0;
	text-decoration: line-through;
	padding-left: 12rpx;
}

.tui-pro-pay {
	padding-top: 10rpx;
	font-size: 24rpx;
	color: #656565;
}

.tui-safe-area {
	height: 1rpx;
	padding-bottom: 200rpx;
}

.tui-invalid-pr {
	// width: 75rpx !important;
}
.tui-invalid-text {
	width: 60rpx;
	// margin-right: 4rpx;
	text-align: center;
	font-size: 24rpx;
	color: #fff;
	background: rgba(0, 0, 0, 0.3);
	transform: scale(0.8);
	transform-origin: center center;
	border-radius: 4rpx;
	flex-shrink: 0;
}
.tui-gray {
	color: #b2b2b2 !important;
}
.tui-flex-center {
	// align-items: center !important;
	margin-bottom: 70rpx;
}
.tui-goods-invalid {
	color: #555;
	font-size: 24rpx;
}
.refundInfo {
	display: flex;
	justify-content: space-between;
	margin-top: 10rpx;
	padding: 20rpx 20rpx;

	background-color: #fff;

	.img {
		width: 80rpx;
		height: 80rpx;
	}
	.setupTitle {
		position: relative;
	}
	.stars {
		color: #f54f46;
		position: absolute;
		top: -10rpx;
		left: 64rpx;
	}
}
.tui-order-content {
	width: 100%;
	padding: 24rpx 20rpx;
	box-sizing: border-box;
	background: #fff;
	font-size: 24rpx;
	line-height: 30rpx;
}

.tui-order-flex {
	display: flex;
	padding-top: 18rpx;
	width: 100%;
	line-height: 24rpx;
	// height: 30rpx;

	.yxf-item-reason {
		width: 100%;
		box-sizing: border-box;
		padding: 10rpx;
		border-radius: 20rpx;
		border: 2rpx solid $borderColor;

		.reason-text {
			margin: 20rpx 1%;
			color: #aaa;
		}

		.reason-img {
			width: 31.3%;
			float: left;
			margin: 10rpx 1%;

			image {
				width: 100%;
				height: 200rpx;
			}
		}
	}
}

.tui-order-flex:first-child {
	padding-top: 0;
}
</style>
